<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>列表页面</title>
	<link rel="shortcut icon" href="favicon.ico">
	<link rel="stylesheet" href="css/themes/default/jquery.mobile-1.4.5.min.css">
	<link rel="stylesheet" href="_assets/css/jqm-demos.css">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">
</head>
<body>
<div data-role="page" id="page1" data-position="fixed">
	<div data-role="header" data-position="fixed">
		<h1>欢迎来到我的主页</h1>
	</div>

	<div data-role="main" class="ui-content">
		<p>欢迎! 点击以下链接跳转到第二个页面。 </p>
		<a href="#page2">弹出对话框</a>
	</div>
<div data-role="footer" data-position="fixed">
		<h1>底部文本</h1>
	</div>
</div>

<div data-role="page" id="page2" data-dialog="true" >
	<div data-role="header" data-position="fixed">
		<h1>欢迎来到我的主页</h1>
	</div>

	<div data-role="main" class="ui-content">
		<p>这是第二个页面。点击以下链接跳转到第一个页面。</p>
		<a href="#page1">跳转到第一个页面</a>
		<a href="#page3">跳转到第san个页面</a>
	</div>

	<div data-role="footer" data-position="fixed">
		<h1>底部文本</h1>
	</div>
</div>

<div data-role="page" id="page3" data-dialog="true"  data-position="fixed">
	<div data-role="header" data-position="fixed">
		<h1>欢迎来到我的主页</h1>
	</div>

	<div data-role="main" class="ui-content">
		<p>这是第三个个页面。点击以下链接跳转到第一个页面。</p>
		<a href="#page1">返回主页</a>
		<a href="#page2">返回第二页</a>

	</div>

	<div data-role="footer"  data-position="fixed">
		<h1>底部文本</h1>
	</div>
</div>
<script src="js/jquery.js"></script>
<script src="_assets/js/index.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
</body>
</html>
